<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>劲松Game:购物车</title>
    <div th:include="Common/common :: head"></div>
    <script type="text/javascript">
        $(function (){
            $(".df-btn").click(function (){
                var name=$(this).attr("itemname");
                if(confirm("你确定要删除【"+name+"】吗")) {
                    var itemid = $(this).attr("itemid");
                    $.ajax({
                        url: "http://localhost:8080/deleteitem",
                        data: {id: itemid},
                        type: "Get",
                        success: function (data) {
                            alert("删除成功");
                            location.href="http://localhost:8080/cart";
                        }
                    })
                }
            });

            $("#clear").click(function (){
                location.href="http://localhost:8080/checkout";
            })
            $("#empty").click(function (){
                if(confirm("你确定要清空购物车吗")){
                    $.ajax({
                        url:"http://localhost:8080/clearall",
                        type:"Get",
                        success:function (data){
                            alert(data);
                            location.href="http://localhost:8080/cart";
                        }
                    })
                }
            })
            $("#shoping").click(function (){
                location.href="http://localhost:8080/games";
            })
            $(".updatecount").change(function (){
                var id=$(this).attr("gameid");
                var name=$(this).attr("gamename");
                var count=this.value;
                if(confirm("你确定要将"+name+"数量修改为:"+count+"吗")){
                    $.ajax({
                        url:"http://localhost:8080/updatecount",
                        data:{id:id,count:count},
                        type:"Get",
                        success:function (data){
                            alert(data);
                            location.href="http://localhost:8080/cart";
                        }
                    })
                }else {
                    this.value=this.defaultValue;
                }

            });
        })
    </script>
</head>
<body>
<div id="main-wrapper">
    <!--Header section start-->
    <div th:include="Common/common :: header"></div>
    <!--Header section end-->
    <div class="container">
        <div class="row">
            <div class="col-md-12"><li><h1 style="color: red" class="font-weight-light">购物车</h1></li></div>
        </div>
        <div class="row">
            <div class="col-md-4 offset-md-10">
                <button class="btn-primary" >添加</button>
                <button class="btn-primary" >删除</button>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <table class="table table-hover" th:if="!(${session.cart.items.isEmpty()})">
                    <tr>
                        <th>游戏编号</th>
                        <th>游戏名称</th>
                        <th>游戏图片</th>
                        <th>游戏数量</th>
                        <th>游戏价格</th>
                        <th>游戏总价</th>
                        <th>操作</th>
                    </tr>
                    <tr th:each="entry:${session.cart.items}">
                        <th th:text="${entry.value.id}"></th>
                        <th th:text="${entry.value.name}"></th>
                        <th><img th:src="${entry.value.image}" width="60" height="60"></th>
                        <th><input type="text" class="updatecount" th:value="${entry.value.count}" th:gameid="${entry.value.id}" style="width: 40px;" th:gamename="${entry.value.name}" ></th>
                        <th th:text="${entry.value.price}+元"></th>
                        <th th:text="${entry.value.totalPrice}+元"></th>
                        <th>
                            <button class="df-btn" id="deleteItem" itemid="" itemname="" th:attr="itemid=${entry.value.id},itemname=${entry.value.name}">删除</button>
                        </th>
                    </tr>
                </table>
                <button type="button" class="btn btn-primary btn-lg btn-block" id="clear" th:if="!(${session.cart.items.isEmpty()})">点我结账</button>
                <button type="button" class="btn btn-primary btn-lg btn-block" id="empty" th:if="!(${session.cart.items.isEmpty()})">点我清空购物车</button>
                <center><h1 th:if="${session.cart.items.isEmpty()}" ><strong>购物车为空哟</strong></li></h1></center>
                <button type="button" class="btn btn-primary btn-lg btn-block" id="shoping" th:if="(${session.cart.items.isEmpty()})">🛒点我购物捏🛒</button>
            </div>
        </div>
    </div>
</div>
<div th:include="Common/common :: laster"></div>
</body>
</html>